@extends('admin.main')

@section('content')
<div class="wrapper wrapper-content">
    <div class="ibox">
        <div class="ibox-title">
            <h5>活动编辑</h5>
        </div>
        <div class="ibox-content">
            <form method="post" id="formInsert" class="form-horizontal" onsubmit="return false">
                @if($row->status!=2)
                <div class="form-group"><label class="col-sm-2 control-label">活动标题</label>
                    <div class="col-sm-8"><input type="text" class="form-control" name="title" placeholder="请输入标题" required="" value="{{$row->title}}"></div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">活动分类</label>
                    <div class="col-sm-3">
                        <div class="input-group m-b">
                            <select class="form-control " name="class_id" required>
                                <option>---请选择分类----</option>
                                @foreach($class as $v)
                                    <option value="{{$v->id}}" @if($row->class_id==$v->id) selected @endif>{{$v->name}}</option>
                                @endforeach
                            </select>
                            <span class="input-group-btn"> <button type="button" class="btn btn-primary" id="classAdd"><i class="fa fa-plus-square-o"></i></button> </span>
                        </div>


                    </div>
                    <label class="col-sm-2 control-label">人数</label>
                    <div class="col-sm-3">
                        <input type="number" class="form-control" name="user_number" value="{{$row->user_number}}" placeholder="请输入人数" required onkeyup="value=value.replace(/[^\d]/g,'') " ng-pattern="/[^a-zA-Z]/">
                    </div>
                </div>

                <div class="hr-line-dashed"></div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">开始时间</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control test-item" placeholder="请输入开始时间" id="datetimeStart" name="start_time" value="{{$row->start_time}}" required>
                    </div>
                    <label class="col-sm-2 control-label">结束时间</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control test-item" placeholder="请输入结束时间" id="datetimeEnd" name="end_time" value="{{$row->end_time}}" required>
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">地点</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control" name="place" value="{{$row->place}}" placeholder="请输入地点" required >
                    </div>
                    <label class="col-sm-2 control-label">报名费</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control" name="price" value="{{$row->price}}" placeholder="请输入报名费" required onkeyup="clearNoNum(this)">
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">举办方</label>
                    <div class="col-sm-3">
                        <input type="text" class="form-control" name="host" value="{{$row->host}}" placeholder="请输入举办方" required >
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group "><label class="col-sm-2 control-label">上传图片</label>
                    <div class="col-sm-8">
                         <a href="javascript:;" class="btn btn-primary" id="div_imgfile">选择图片</a>
                         <input type="file" style="display:none" class="imgfile" id="file">
                    </div>
                </div>
                <div class="form-group "><label class="col-sm-2 control-label"></label>
                    <div class="col-sm-8" id="div_imglook">
                        <div class="BoxGallery">
                           @if($row->pic1)
                                @foreach($row->pic1 as $pic)
                                <a href="javascript:;" title="Image from Unsplash" data-gallery=""><img src="{{asset($pic)}}" alt="" width="100px" url="{{$pic}}" ><span class="del-img"><i class="fa fa-times "></i></span></a>
                                @endforeach
                            @endif
                        </div>
                        
                    </div>
                </div>

                <div class="hr-line-dashed"></div>
                <div class="form-group "><label class="col-sm-2 control-label">介绍</label>
                    <div class="col-sm-8">
                        <textarea class="form-control" name="introduction" required>{{$row->introduction}}</textarea>
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group "><label class="col-sm-2 control-label">报名须知</label>
                    <div class="col-sm-8">
                        <textarea class="form-control"  name="notes" rows="5">{{$row->notes}}</textarea>
                        <span class="help-block m-b-none text-danger">多条请手动回车换行</span>
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group "><label class="col-sm-2 control-label">活动内容</label>
                    <div class="col-sm-8">
                        <textarea id="ueditor_content" name="content" rows="30">{{$row->content}}</textarea>
                    </div>
                </div>
                <div class="hr-line-dashed"></div>
                <div class="form-group "><label class="col-sm-2 control-label">发布</label>
                    <div class="col-sm-8">
                        <label class="checkbox-inline"> <input type="radio" value="0" name="status" @if($row->status==0) checked @endif> 保存草稿 </label>
                        <label class="checkbox-inline"><input type="radio" value="1"  name="status" @if($row->status==1) checked @endif> 立即发布 </label>
                        <label class="checkbox-inline"><input type="radio" value="10"  name="status" @if($row->status==10) checked @endif> 定时发布 </label>
                    </div>
                </div>
                <div class="hr-line-dashed tbl-publish" style="display: none;"></div>
                <div class="form-group tbl-publish" style="display: none;"><label class="col-sm-2 control-label">发布时间</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control test-item" id="publish_time" name="publish_time" value="{{$row->publish_time}}" placeholder="发布时间" >
                    </div>
                </div>
                @else
                <div class="form-group "><label class="col-sm-2 control-label">活动回顾</label>
                    <div class="col-sm-8">
                        <textarea id="ueditor_look_back" name="look_back" rows="30">{{$row->look_back}}</textarea>
                    </div>
                </div>
                @endif
                <div class="hr-line-dashed"></div>
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-2" id="js-submit">
                        <input type="hidden" class="form-control" name="id" value="{{$row->id}}">
                        <button class="btn btn-primary" type="submit">提交</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection

@section('pageheader')
<style type="text/css">
    #div_imglook a{
        border:1px solid red;
        margin:12px;
        display: inline-block;
        position: relative;
    }

    #div_imglook .del-img {
        position: absolute;
        top: 0px;
        left: 0px;
    }
</style>
@endsection
@section('pagescript')
    <script src="/assets/layDate/laydate.js"></script>
<script src="/assets/ueditor/ueditor.config.js"></script>
<script src="/assets/ueditor/ueditor.all.js"></script>
<script>
    $("#side-menu li[rel='activity']").addClass("active")
    .find("ul").addClass("in")
    .find("li[rel='1']").addClass("active");
    var filter = {page:1,status:0};
    var ueditor;
    var ueditor2;

    lay('.test-item').each(function(){
      laydate.render({
        elem: this
        ,trigger: 'click'
        ,type: 'datetime'
      });
    });

    $(function () {
        ueditor = UE.getEditor('ueditor_content', {
            zIndex: 9,
            autoHeightEnabled:false,
            initialFrameHeight:400,
        });
        ueditor2 = UE.getEditor('ueditor_look_back', {
            zIndex: 9,
            autoHeightEnabled:false,
            initialFrameHeight:400,
        });


        // ueditor.ready(function() {//编辑器初始化完成再赋值
        //     ueditor.setContent("{{$row->content}}",false);  //赋值给UEditor
        // });
        $(':radio').click(function(){
            var value = $("input[name='status']:checked").val();  //获取选中的radio的值
            if (value==10) {
                $('.tbl-publish').show();
            }else{
                $('.tbl-publish').hide();
            }
        });

        $("#div_imglook").on("click", ".del-img", function(){
            $(this).parents('a').eq(0).remove();
        })



        $("input[name='items']:checked").val();
        $('#classAdd').click(function(){
            layer.prompt({title: '请输入分类名称', formType: 0}, function(text){
                $.post('/admin/activity/class/insert',{'name':text},function(data){
                    layer.msg('添加成功',{time:500},function(){
                        window.location.reload();
                    });
                }).fail(failure);
            });
        })


        $("#div_imgfile").click(function (e) {
            e.preventDefault();
            $(".imgfile").trigger('click');//打开对象选择框
        });

        //创建预览图，在动态创建的file元素onchange事件中处理
        $(".imgfile").change(function () {
            var formData = new FormData();
            formData.append('file', $('#file')[0].files[0]);
            $.ajax({
                url : '/admin/upload-img',
                type : 'post',
                data : formData,
                contentType : false,
                processData : false,
                cache : false,
                success : function (url) {
                    var html = '<a href="javascript:;" data-gallery="">';
                        html += '<img src="/'+url+'" alt="" width="100px" url="'+url+'">';
                        html += '<span class="del-img"><i class="fa fa-times del-img"></></span>';
                    $('#div_imglook .BoxGallery').append(html);
                }
            });
        });

        $("body").on("submit", "#formInsert", function(){
            var formData =  $("#formInsert").serializeArray();

            @if($row->status!=2)
                var pic = '';
                $('#div_imglook a').each(function(index,element){
                    pic += $(this).find('img').attr('url')+'|';
                });
                formData.push({"name":"pic","value":pic});
            @endif

            $.ajax({
                url:"/admin/activity/store",
                type:"post",
                data:formData,
                success:function(data){
                    layer.msg('添加成功');
                    if("{{$row->id}}"){
                        window.history.go(-1);
                    }else{
                        $('#formInsert')[0].reset();
                        $('#div_imglook').html('');
                    }
                    ueditor.execCommand('cleardoc');
                },
                error:function(data){
                      var str = typeof(data) == 'string' ? data : data.responseJSON;
                      layer.msg(str, {icon:0});
                      return false;
                }
            });

            return false;
        });
    })

</script>
@endsection
